<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@	page import="java.util.ArrayList"%>
<%@	page import="kau.dao.*"%>
<%@	page import="kau.vo.*"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>회원가입</title>

<script type="text/javascript">
	var isIdCheck = 0;

	$(document).ready(function() {
		$("#idCheck").click(function() {
			var param = {
				custId : $("#inputCustId").val()
			};
			$.get("idCheck.cust", param, eventHandler);
		});

	});

	function eventHandler(responseStr) {
		if (responseStr.search("true") != -1) {
			alert("이미존재하는 ID입니다.");
			isIdCheck = 0;
		} else if (responseStr.search("false") != -1) {
			alert("사용 가능한 ID입니다.");
			isIdCheck = 1;
		}
	}

	function isCheck() {
		isIdCheck = 0;
	}

	function checkUserInput() {

		var custId = document.getElementById("inputCustId").value;
		var password = document.getElementById("inputPassword").value;
		var custName = document.getElementById("custName").value;

		var jumin1 = document.getElementById("jumin1").value;
		var jumin2 = document.getElementById("jumin2").value;

		var custEmail = document.getElementById("custEmail").value;
		var email = document.getElementById("selectEmail").value;

		var phoneNumber1 = document.getElementById("phoneNumber1").value;
		var phoneNumber2 = document.getElementById("phoneNumber2").value;
		var phoneNumber3 = document.getElementById("phoneNumber3").value;

		var parentPhoneNumber1 = document.getElementById("parentPhoneNumber1").value;
		var parentPhoneNumber2 = document.getElementById("parentPhoneNumber2").value;
		var parentPhoneNumber3 = document.getElementById("parentPhoneNumber3").value;

		var passwordAnswer = document.getElementById("passwordAnswer").value;

		// 아이디를 입력했는지 검사합니다.
		if (custId == "" || custId == null) {
			alert("ID를 입력하세요");
			document.getElementById("custId").focus();
			return;
		}

		// 비밀번호를 입력했는지 검사합니다.
		if (password == "" || password == null) {
			alert("비밀번호를 입력하세요");
			return;
		} else if (password.length < 6) {
			alert("비밀번호는 6글자 이상입니다.");
			return;
		}

		// 사용자 이름을 입력했는지 검사합니다.
		if (custName == "" || custName == null) {
			alert("사용자 이름을 입력하세요");
			return;
		}

		// 주민등록번호를 입력했는지 검사합니다.
		if (jumin1 == "" || jumin2 == "" || jumin1.length < 6
				|| jumin2.length < 7) {
			alert("주민등록번호를 확인하세요");
			return;
		}

		if (email == "" || custEmail == "") {

			alert("Email을 입력해주세요");
			return;
		}

		if (phoneNumber1 == "" || phoneNumber2 == "" || phoneNumber3 == "") {
			alert("핸드폰 번호를 입력하세요");
			return;
		}

		if (phoneNumber1.length < 3 || phoneNumber2.length < 3
				|| phoneNumber2.length < 4) {
			alert("핸드폰 번호를 확인하세요");
			return;
		}

		if (parentPhoneNumber1 == "" || parentPhoneNumber2 == ""
				|| parentPhoneNumber3 == "") {
			alert("부모님 핸드폰 번호를 입력하세요");
			return;
		}

		if (passwordAnswer == "") {
			alert("질문답을 입력하세요");
			return;

		}

		if (isIdCheck != 1) {

			alert("아이디 체크를 해주세요");
			return;
		}

		alert("회원 등록 되었습니다.");
		document.getElementById("signupForm").submit();
	}

	function selfInput() {

		if (document.getElementById("selectEmail").value == 'change') {
			alert('nice');
			var div1 = document.getElementById("selectEmailDiv");
			var div2 = document.getElementById("textEmailDiv");

			document.getElementById("selectEmail").name = "temp";

			div1.style.display = "none";
			div2.style.display = "block";
		}

	}

	function num_only() {
		if (((event.keyCode < 48) || (event.keyCode > 57))
				&& (event.keyCode != 110)) {
			event.returnValue = false;
		}
	}
</script>
<style type="text/css">
#info {
	font-family: '맑은고딕', dotum, sans-serif, bold;
	font-size: 13px
}
</style>
<style type="text/css">
<!--
@import url("css/style.css");
-->
</style>
</head>

<body>


	<div style="margin-left: 20px; margin-bottom: 30px; margin-top: 20px"
		id="info">
		<div class="content_header">

			<p>
				<img src="/nems/cust/img/top.png">
			</p>
			<hr width="670">
		</div>
		<div class="section">
			<form class="form-horizontal" action="/nems/save.cust" method="post"
				id="signupForm">


				<table width="600" border="0">
					<tr align="left">
						<td width="350" height="40"><img
							src="/nems/cust/img/check.png" width="13" height="20">아이디</td>
						<td width="250"><input type="text" id="inputCustId"
							name="inputCustId" onfocus="isCheck()" /></td>
						<td align="left"><a href="#" id="idCheck"> <img
								src="/nems/img/idcheck.png" id="checkId" class="btn"
								name="checkId" border="0"></a></td>
					</tr>

					<tr align="left">
						<td width="350" height="40"><img
							src="/nems/cust/img/check.png" width="13" height="20">비밀번호</td>
						<td width="250"><input type="password" id="inputPassword"
							name="inputPassword" /></td>
					</tr>

					<tr align="left">
						<td width="350" height="40"><img
							src="/nems/cust/img/check.png" width="13" height="20">이름</td>
						<td width="250"><input type="text" id="custName"
							name="custName" /></td>
					</tr>

					<tr align="left">
						<td width="350" height="40"><img
							src="/nems/cust/img/check.png" width="13" height="20">주민등록번호</td>
						<td width="150"><input type="text" name="jumin1" id="jumin1"
							size="9" maxlength="6" onKeyPress="num_only()">-<input
							type="text" name="jumin2" id="jumin2" size="9" maxlength="7"
							onKeyPress="num_only()"></td>
					</tr>

					<tr align="left">
						<td width="350" height="40"><img
							src="/nems/cust/img/check.png" width="13" height="20">Email</td>
						<td width="250"><input type="text" id="custEmail" size="9"
							name="custEmail" /> @
							<div id="selectEmailDiv">
								<select id="selectEmail" name="email" onchange="selfInput()">
									<option value="naver.com">naver.com</option>
									<option value="chol.com">chol.com</option>
									<option value="dreamwiz.com">dreamwiz.com</option>
									<option value="empal.com">empal.com</option>
									<option value="freechal.com">freechal.com</option>
									<option value="gmail.com">gmail.com</option>
									<option value="hanafos.com">hanafos.com</option>
									<option value="hanmail.net">hanmail.net</option>
									<option value="hanmir.com">hanmir.com</option>
									<option value="hitel.net">hitel.net</option>
									<option value="hotmail.com">hotmail.com</option>
									<option value="korea.com">korea.com</option>
									<option value="lycos.co.kr">lycos.co.kr</option>
									<option value="nate.com">nate.com</option>
									<option value="netian.com">netian.com</option>
									<option value="paran.com">paran.com</option>
									<option value="yahoo.com">yahoo.com</option>
									<option value="yahoo.co.kr">yahoo.co.kr</option>
									<option value="change">직접입력</option>
								</select>
							</div>

							<div id="textEmailDiv" style="display: none;">
								<input type="text" name="email" />
							</div></td>
					</tr>

					<tr align="left">
						<td width="350" height="40"><img
							src="/nems/cust/img/check.png" width="13" height="20">핸드폰번호</td>
						<td width="250"><input type="text" name="phoneNumber1"
							id="phoneNumber1" size="4" maxlength="3" onKeyPress="num_only()" />
							- <input type="text" id="phoneNumber2" name="phoneNumber2"
							size="5" maxlength="4" onKeyPress="num_only()" /> - <input
							type="text" name="phoneNumber3" id="phoneNumber3" size="5"
							maxlength="4" onKeyPress="num_only()" /></td>
					</tr>

					<tr align="left">
						<td width="350" height="40"><img
							src="/nems/cust/img/check.png" width="13" height="20">부모님
							핸드폰번호</td>
						<td width="250"><input type="text" name="parentPhoneNumber1"
							id="parentPhoneNumber1" size="4" maxlength="3"
							onKeyPress="num_only()" /> - <input type="text"
							id="parentPhoneNumber2" name="parentPhoneNumber2" size="5"
							maxlength="4" onKeyPress="num_only()" /> - <input type="text"
							name="parentPhoneNumber3" id="parentPhoneNumber3" size="5"
							maxlength="4" onKeyPress="num_only()" /></td>
					</tr>

					<tr align="left">
						<td width="350" height="40"><img
							src="/nems/cust/img/check.png" width="13" height="20">비밀번호
							찾기 질문</td>
						<td width="250"><select id="passwordQuestion"
							name="passwordQuestion">
								<option value="1">본인의 출생지는?</option>
								<option value="2">나의 출신 초등학교는?</option>
								<option value="3">나의 좌우명은?</option>
								<option value="4">가장 생각나는 친구 이름은?</option>
								<option value="5">나의 보물 제1호는?</option>
						</select></td>
					</tr>

					<tr align="left">
						<td width="350" height="40"><img
							src="/nems/cust/img/check.png" width="13" height="20">비밀번호
							찾기 답</td>
						<td width="250"><input type="text" id="passwordAnswer"
							name="passwordAnswer" /></td>
					</tr>	
					<tr>
						
						<td colspan="2">
							<br>	
							<button class="positive" type="button" onclick="checkUserInput()"
								style="width: 70px;">
								<img src="cust/img/shopping_cart_accept.png"
									style="width: 20px; height: 10px" />확인
							</button>

							<button class="negative" style="width: 70px;"
								onclick="javascript:location.replace('index.jsp')">
								<img src="cust/img/delete.png" style="width: 20px; height: 10px" />취소
							</button>
						</td>
					</tr>
					<tr>
				</table>


			</form>
		</div>

	

</body>
</html>